<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>会员管理</title>
		<link rel="stylesheet" href="../../lib/layui-v2.6.3/css/layui.css"  tppabs="https://www.layui.site/layui/dist/css/layui.css"  media="all">
	</head>
	<body>
		<div class="layui-tab">
		  <ul class="layui-tab-title">
		    <li class="layui-this">会员管理</li>
		    <li>会员消费统计</li>
		  </ul>
		  <div class="layui-tab-content">
			  <!-- 会员管理-->
		    <div class="layui-tab-item layui-show" style="padding:0px 10px 0px 10px;">
				<div class="layui-row" style="text-align: center;">
					<div class="layui-col-md2">
						<button type="button" class="layui-btn layui-btn-normal" id="" lay-event="">积分设置</button>
					</div>
					<div class="layui-col-md2">
					    <button type="button" class="layui-btn layui-btn-normal" id="" lay-event="">会员级别</button> 
					</div>
					<div class="layui-col-md2">
					    <button type="button" class="layui-btn layui-btn-normal" id="memberMagerInsert" lay-event="memberMagerInsert">增加会员</button>  
					</div>
					<div class="layui-col-md2">
					    <button type="button" class="layui-btn layui-btn-normal" id="memberMagerUpdate" lay-event="memberMagerUpdate">修改会员</button>  
					</div>
					<div class="layui-col-md2">
					    <button type="button" class="layui-btn layui-btn-normal" id="memberMagerDelete" lay-event="memberMagerDelete">删除会员</button>  
					</div>
					<div class="layui-col-md2"> 
					    <button type="button" class="layui-btn layui-btn-normal" id="" lay-event="">退&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;出</button>  
					</div>
				</div>
				<div class="layui-form-item" style="text-align:center;padding-top: 15px;margin-bottom: -10px;">
					<div class="layui-inline">
					  <div class="layui-input-block">
						<label class="layui-form-label" style="width: 160px;">输入会员相关信息寻找：</label>
					    <input type="text" name="ClientInfos" style="width: 300px;border: 1px solid #000000;" class="layui-input">  
					  </div>
					</div>
					<div class="layui-inline">
					    <button type="button" id="searchClientInfo" class="layui-btn layui-btn-normal">查询</button>   
					</div>
				</div>
				
				<table class="layui-hide" id="memberManagemrnt" lay-filter="memberManagemrnt"></table>
				
				<div class="layui-form-item" style=" text-align: center; margin-bottom: -15px;">
					<div class="layui-inline">
					    <span style="color: red;" id="menName"></span>  
					</div>
					<div class="layui-inline">
					  <div class="layui-input-block">
						<label class="layui-form-label" style="width: 160px;">输入会员相关信息寻找：</label>
						<div class="layui-inline" id="test6">
							<div class="layui-input-inline">
							  <input type="text" autocomplete="off" id="test-startDate-1" class="layui-input" placeholder="开始日期">
							</div>
							<div class="layui-form-mid">-</div>
							<div class="layui-input-inline">
							  <input type="text" autocomplete="off" id="test-endDate-1" class="layui-input" placeholder="结束日期">
							</div>
					    </div>
					  </div>
					</div>
					<div class="layui-inline">
					    <button type="button" class="layui-btn layui-btn-normal">查询</button>   
					</div>
				</div>
				
				<table class="layui-hide" id="memberInfo" lay-filter="memberInfo"></table>
				
			</div>
			  <!-- 会员消费统计 -->
		    <div class="layui-tab-item" style="padding: 0 10px 0 10px;">
				<div class="layui-form-item" style="margin-bottom: -15px;">
					<div class="layui-inline">
					  <div class="layui-input-block">
						<label class="layui-form-label">输入日期：</label>
						<div class="layui-inline" id="test6">
							<div class="layui-input-inline" style="width: 100px;" >
							  <input type="text" autocomplete="off" id="test-startDate-1" class="layui-input" placeholder="开始日期">
							</div>
							<div class="layui-form-mid">-</div>
							<div class="layui-input-inline" style="width: 100px;">
							  <input type="text" autocomplete="off" id="test-endDate-1" class="layui-input" placeholder="结束日期">
							</div>
					    </div>
					  </div>
					</div>
					<div class="layui-inline">
					  <div class="layui-input-block">
						<label class="layui-form-label" style="width: 160px;">输入会员相关信息寻找：</label>
					    <input type="text" name="title" style="border: 1px solid #000000;width: 200px;" class="layui-input">  
					  </div>
					</div>
					<div class="layui-inline">
					    <button type="button" class="layui-btn layui-btn-normal">查询</button>   
					</div>
				</div>
				
				<table class="layui-hide" id="consumeManager" lay-filter="consumeManager"></table>
				
				<div style="margin-top: 15px;">
					<div class="layui-inline">
					    <span>单据详情信息：</span> <span></span> 
					</div>
				</div>
				
				<table class="layui-hide" id="consumeInfo" lay-filter="consumeInfo"></table>
			</div>
		  </div>  
		</div>
		
		
		<script src="../../layui/layui.js" charset="utf-8"></script>
		<script type="text/javascript">
			layui.use(['form' , 'laydate' , 'element' , 'table', 'layer'], function() {
				var tree = layui.tree
				    ,layer = layui.layer
					,table = layui.table
					,laydate = layui.laydate
					,element = layui.element
					,$ = layui.jquery;
					$("#searchClientInfo").click(function(){
						var menName = $("input[name=ClientInfos]").val()
						table.reload('memberManagemrnt', {
						    url:"../../../searchClientInfo?menName="+menName
						}); 
						
					})
					var menId; 
					var menInfo;
				/* 判断按钮是增加修改删除会员信息 */
					$("#memberMagerInsert").click(function(){
						// window.memberInfo = JSON.stringify();
						layer.open({
							type: 2,
							title: '添加客户',
							scrollbar: false,
							area: ['750px', '90%'],
							content: 'insertMemberMager.html?flog=true'
						});
					})
					$("#memberMagerUpdate").click(function(){
						if(menId != null){//判断当前有没有选择会员数据
							layer.open({
								type: 2,
								title: '修改用户',
								scrollbar: false,
								area: ['750px', '90%'],
								content: 'insertMemberMager.html?flog=false'
							});
						}else{
							layer.msg("请先选择要修改的会员");
						}
					})
					//点击删除会员按钮
					$("#memberMagerDelete").click(function(){
						if(menId != null){
							layer.confirm('确认删除会员信息？', function(){
								$.get("../../../updataClientInfoDelete",{menId:menId},function(obj){
									if(obj == 1){
										menInfo.del();
										layer.msg("删除成功！")
									}else{
										layer.msg("删除失败！")
									}
								})
							}); 
						}else{
							layer.msg("请先选择要删除的会员");
						}
					})
									
				//日期范围
			    laydate.render({
					elem: '#test6'
					//设置开始日期、日期日期的 input 选择器
					//数组格式为 2.6.6 开始新增，之前版本直接配置 true 或任意分割字符即可
					,range: ['#test-startDate-1', '#test-endDate-1']
			    });
				
				//单击行事件
				table.on('row(memberManagemrnt)', function(obj){
					obj.tr.addClass('layui-bg-green').siblings().removeClass('layui-bg-green');
					menId = obj.data.menId;
					menInfo = obj;
					$("#menName").html(obj.data.menName)
					table.reload('memberInfo', {
					    url:"../../../searchClientSaleOrderDescInfo?menId="+menId
					}); 
					//当前行数据进行页面的传输
					window.memberInfo = JSON.stringify(obj.data);
				}); 
				//会员信息表
				table.render({
					elem: '#memberManagemrnt'
					,url: '../../../searchClientInfo' //数据接口
					,title: '会员信息'
					,height: 300
					// ,page: true //开启分页/
					,totalRow: true //开启合计行
					,cols: [[ //表头
					  {field: 'menId', title: '会员编号', width:100, fixed: 'left', totalRowText: '合计：',totalRow: true}
					  ,{field: 'menName', title: '会员名称', width:100}
					  ,{field: 'menPoint', title: '会员积分', width: 100}
					  ,{field: 'menTypeId', title: '会员级别', width:100, templet:function(obj){
						  return obj.menmberTypeld.menTypeName;
					  }}
					  ,{field: 'menCustPrice', title: '消费总额', width: 100, totalRow: '{{ parseInt(d.TOTAL_NUMS) }} 分'}
					  ,{field: 'menCustNum', title: '消费次数', width:100} 
					  ,{field: 'menPointBalance', title: '积分余额', width: 100}
					  ,{field: 'menCardBalance', title: '卡内余额', width: 100}
					  ,{field: 'menStatus', title: '会员状态', width: 100, templet:function(obj){
						 if(obj.menStatus == 1){
							return "启用"
						 }else{
							 return "禁用"
						 }
						}}
					  ,{field: 'menPointUpgrade', title: '按积分升级', width: 100, templet:function(obj){
						  if(obj.menPointUpgrade == 1){
							return "启用"
						  }else{
							return "禁用"
						  }
						}}
					  ,{field: 'menPreferential', title: '优惠方式', width: 100}
					  ,{field: 'menStartDate', title: '加入日期', width: 120,templet:'<div>{{ layui.util.toDateString(d.menStartDate, "yyyy-MM-dd") }}</div>'}
					  ,{field: 'menFinalDate', title: '到期日期', width: 120,templet:'<div>{{ layui.util.toDateString(d.menFinalDate, "yyyy-MM-dd") }}</div>'}
					]]
				});	
				
				//会员订单表
				table.render({
				    elem: '#memberInfo'
				    ,url: '../../api/aaa.json' //数据接口
				    ,title: '用户表'
					,height: 300
				    ,page: true //开启分页
				    ,totalRow: true //开启合计行
				    ,cols: [[ //表头
					{field: 'salOrdId', title: '销售单号', width:200, fixed: 'left', totalRowText: '合计：'}
				      ,{field: 'salOrdDate', title: '销售日期', width:120,templet:'<div>{{ layui.util.toDateString(d.salOrdDate, "yyyy-MM-dd") }}</div>'}
				      ,{field: 'salOrdReceivable', title: '消费金额', width: 120, sort: true, totalRow: true}
				      ,{field: 'salOrdPaidIn', title: '实际支付', width:120, sort: true}
				      ,{field: 'salOrdPaidIn', title: '现金', width: 120, sort: true, totalRow: '{{ parseInt(d.TOTAL_NUMS) }} 元'}
				      ,{field: '', title: '操作员', width:150,templet:function(obj){
						  return obj.employeeInfo.empName
					  }} 
				     ]],
					limits: [6, 9, 12],
					limit: 6
				});	
				
				
				table.render({
				    elem: '#consumeManager'
				    ,url: '../../../searchClientSaleOrderDescInfo' //数据接口
				    ,title: '会员消费表'
				    ,page: true //开启分页
				    ,totalRow: true //开启合计行
				    ,cols: [[ //表头
					{field: 'id', title: '销售单号', width:80, sort: true, fixed: 'left', totalRowText: '合计：'}
				      ,{field: 'username', title: '销售日期', width:80}
				      ,{field: 'experience', title: '会员编号', width: 90, sort: true, totalRow: true}
				      ,{field: 'sex', title: '消费金额', width:80, sort: true}
				      ,{field: 'score', title: '实际支付', width: 80, sort: true, totalRow: '{{ parseInt(d.TOTAL_NUMS) }} 分'}
				      ,{field: 'city', title: '本次积分', width:150} 
				      ,{field: 'sign', title: '现金', width: 200}
				    ]],
					limits: [6, 9, 12],
					limit: 6
				});		
				
				//单击行事件
				table.on('row(consumeManager)', function(obj){
					obj.tr.addClass('layui-bg-green').siblings().removeClass('layui-bg-green');
					console.log(obj.data)
					// $("#menName").html(obj.data.menName)
					// table.reload('consumeInfo', {
					//     url:"../../../searchClientSaleOrderDescInfoHandler?string="+menId
					// }); 
				}); 
				
				table.render({
				    elem: '#consumeInfo'
				    ,url: '../../api/aaa.json' //数据接口
				    ,title: '用户表'
					,height: 200
				    // ,page: true //开启分页
				    ,totalRow: true //开启合计行
				    ,cols: [[ //表头
					   {field: 'id', title: '商品编号', width:80, sort: true, fixed: 'left', totalRowText: '合计：'}
				      ,{field: 'username', title: '商品名称', width:80}
				      ,{field: 'experience', title: '单位', width: 90, sort: true, totalRow: true}
				      ,{field: 'sex', title: '单价', width:80, sort: true}
				      ,{field: 'score', title: '数量', width: 80, sort: true, totalRow: '{{ parseInt(d.TOTAL_NUMS) }} 分'}
				      ,{field: 'city', title: '总金额', width:150} 
				      ,{field: 'sign', title: '产品规格', width: 200}
				      ,{field: 'classify', title: '产品批号', width: 100}
				      ,{field: 'wealth', title: '有效期至', width: 135, sort: true, totalRow: true}
				    ]]
				});		
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
					
			})
		</script>
	</body>
</html>
